<template>
  <div class="dashboard-table-panel">
  <!--<div>-->

    <div class="table-title">主控点</div>
    <el-table
      :data="controlTableData"
      :show-header="false"
      height="150"
      stripe
      style="width: 100%">
      <el-table-column
        prop="area"
        label="区域"
        width="80">
      </el-table-column>
      <el-table-column
        prop="address"
        label="地址">
      </el-table-column>
      <el-table-column
        prop="spec1"
        label="指标1"
        width="80">
      </el-table-column>
      <el-table-column
        prop="spec2"
        label="指标2"
        width="80">
      </el-table-column>
    </el-table>

    <div class="table-title">水厂</div>
    <el-table
      :data="waterworksTableData"
      :show-header="false"
      height="110"
      stripe
      style="width: 100%">
      <el-table-column
        prop="waterworks"
        label="水厂">
      </el-table-column>
      <el-table-column
        prop="spec"
        label="指标"
        >
      </el-table-column>
    </el-table>

  </div>
</template>

<script>
  export default {
    data() {
      return {
        controlTableData: [{
          area: '中环',
          address: '工行大厦',
          spec1: 'XX MPa',
          spec2: 'XX MPa'
        }, {
          area: '下环',
          address: '康城大泵房绿化带旁',
          spec1: 'XX MPa',
          spec2: 'XX MPa'
        }, {
          area: '下环',
          address: '世纪大道NE',
          spec1: 'XX MPa',
          spec2: 'XX MPa'
        }, {
          area: '下环',
          address: '南林小区',
          spec1: 'XX MPa',
          spec2: 'XX MPa'
        }],

        waterworksTableData: [{
          waterworks: '三坪水厂',
          spec: '总流量 XXm3/h',
        }, {
          waterworks: '第五净化水厂',
          spec: '总流量 XXm3/h',
        }, {
          waterworks: '第六净化水厂',
          spec: '总流量 XXm3/h',
        }]
      }
    }
  }
</script>

<style lang="sass" scoped>
  .dashboard-table-panel
    position: absolute
    z-index: 20
    top: 50%
    margin-top: -175px
    left: 30px
    width: 436px
    height: 350px
    padding: 20px
    background-color: #fff
    box-shadow: 1px 1px 5px #eae7e0
    border-radius: 5px
    opacity: 0.96
  .table-title
      text-align: center
      font-size: 14px
      font-weight: bolder
      color: #222
</style>
